<!-- eslint-disable vue/multi-word-component-names -->
<template>
  <div>
    <ul>
        <li>
            <dv-border-box9 style="border: ;">
            <dl>
                <dt>当前客户数量</dt>
                <dd>53</dd>
            </dl>
            </dv-border-box9>
        </li>
        <li>
            <dv-border-box9>
            <dl>
                <dt>使用设备数量</dt>
                <dd>75</dd>
            </dl>
            </dv-border-box9>
        </li>
        <li>
            <dv-border-box9>
            <dl>
                <dt>总存栏数量</dt>
                <dd>144000</dd>
            </dl>
            </dv-border-box9>
        </li>
    </ul>
  </div>
</template>

<script lang="ts" setup>
// import { BorderBox4 } from '@dataview/datav-vue3';


</script>

<style scoped>
ul {
    width: 100%;
    height: 100%;
}

ul li {
    color: aliceblue;
    width: 10vw;
    height: 10vh;
    margin-left: 4.2vw;
    margin-top: 2vh;
    float: left;
    border-radius: 5%;
}

dl {
    width: 100%;
    height: 100%;
}

dl dt {
    width: 100%;
    height: 50%;
    text-align: center;
    line-height: 7vh;
    font-weight: bold;
    font-size: 24px;
    color: #25ebe8;
}

dl dd {
    width: 100%;
    height: 50%;
    text-align: center;
    font-weight: bold;
    font-size: 22px;
    color: #d79322;
    text-decoration: underline;
}

</style>